<template>
  <div class="container">
    <Breadcrumb :items="['供应科', '供货厂家']" />
    <a-card direction="vertical" :size="12" fill :title="`厂家管理`">
      <a-row style="margin-bottom: 16px">
        <a-col :span="12">
          <a-space>
            <a-button type="primary" @click="openGonghuoDialog">
              <template #icon>
                <icon-plus />
              </template>
              新增供货厂家
            </a-button>
            <a-tooltip content="当前截至数据总数">
              <div class="action-icon" @click="getProducedataInfo(1)"
                >（总计{{manageGonghuoList.length}}条数据）</div
              >
            </a-tooltip>
            <a-tooltip :content="$t('searchTable.actions.refresh')">
              <div class="action-icon" @click="getManageList()"
                ><icon-refresh size="18"
              /></div>
            </a-tooltip>
          </a-space>
        </a-col>
      </a-row>
      <!-- 表格 -->
      <a-table
        :columns="columns"
        :data="manageGonghuoList"
        size="large"
        :bordered="{ wrapper: true, cell: true }"
      >
        <template #action="{ record }">
          <a-button type="text" @click="editGonghuo(record)">编辑</a-button>
        </template>
      </a-table>
    </a-card>
    <SaveGonghuoDialog ref="saveGonghuoDialog" :getManageList="getManageList" />
  </div>
</template>

<script lang="ts" setup>
import SaveGonghuoDialog from './components/saveGonghuoDialog.vue';
import { getManageGonghuo } from '@/api/manage';
import { ref } from 'vue';

const manageGonghuoList = ref([]);
const getManageList = async () => {
  const { data, code } = await getManageGonghuo();
  if (code === 200) {
    manageGonghuoList.value = data;
  }
};

const saveGonghuoDialog = ref(null);
const openGonghuoDialog = () => {
  saveGonghuoDialog.value.openDialog();
};
const editGonghuo = (record) => {
  if(record.create_time) {
    const createDate = new Date(record.create_time);
    const now = new Date();
    const diff = now.getTime() - createDate.getTime();
    const tenMinutesInMs = 10 * 60 * 1000; // 10分钟的毫秒数
    if(!(diff >= 0 && diff <= tenMinutesInMs)) {
      Message.error('数据创建超过十分钟,暂不可修改');
      return
    }
  }
  saveGonghuoDialog.value.openDialog(record);
}
const columns = ref([
  {
    title: '#',
    dataIndex: 'id',
  },
  {
    title: '供货厂家',
    dataIndex: 'manage_gonghuo_name',
  },
  {
    title: '供货厂家联系人',
    dataIndex: 'manage_gonghuo_penpole',
  },
  {
    title: '供货厂家联系电话',
    dataIndex: 'manage_gonghuo_phone',
  },
  {
    title: '供货厂家地址',
    dataIndex: 'manage_gonghuo_address',
  },
  {
    title: '操作',
    slotName:'action',
    width: 150,
  },
]);
getManageList()
</script>

<style lang="scss" scoped>
</style>